const { defineConfig } = require('@vue/cli-service')
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')
const path = require('path')
const webpack = require('webpack')

module.exports = defineConfig({
  transpileDependencies: true,
  configureWebpack: () => {
    return {
      plugins: [
        AutoImport({
          resolvers: [ElementPlusResolver()]
        }),
        Components({
          resolvers: [ElementPlusResolver()]
        }),
        new webpack.ProvidePlugin({
          dayjs: 'dayjs',
          _: [path.resolve(__dirname, 'src/libs/lodash.ts'), 'default'],
          echarts: [path.resolve(__dirname, './src/libs/echarts.ts'), 'default']
        })
      ],
      resolve: {
        alias: {
          '@': path.resolve(__dirname, 'src'),
          'vue-i18n': 'vue-i18n/dist/vue-i18n.cjs'
        }
      }
    }
  },
  devServer: {
    hot: true,
    proxy: {
      '/api/': {
        target: 'http://127.0.0.1:5100/',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  },
  pluginOptions: {
    'style-resources-loader': {
      preProcessor: 'scss',
      patterns: [
        path.resolve(__dirname, 'src/styles/_variables.scss'),
        path.resolve(__dirname, 'src/styles/_mixins.scss')
      ]
    }
  }
})
